<script setup lang="ts">
import { ref, watch, computed } from 'vue'
import { roleStore } from '@/stores/role'
import { headersStore } from '@/stores/apiHeader'
import { baseToolsStore } from '@/stores/baseTools'
//全球绩效分布
import GlobalPerformanceDistributionFile from '@/components/PermissionsModule/Human/GlobalPerformanceDistributionFile.vue'
//全球各区绩效结果
import Performance from '@/components/PermissionsModule/Human/Performance.vue'
//技术部绩效
import ITPerformanceReport from '@/components/PermissionsModule/Human/ITPerformanceReport.vue'
//欧亚区回款率
import EurasiaCollectionRate from '@/components/PermissionsModule/Human/EurasiaCollectionRate.vue'
//欧亚区回款趋势
import RepaymentRateTrend from '@/components/PermissionsModule/Human/RepaymentRateTrend.vue'
//全球直销营收同比增长情况
import GlobalDirectSalesRevenueYoYGrowth from '@/components/PermissionsModule/Human/GlobalDirectSalesRevenueYoYGrowth.vue'
//全球直销利润同比增长情况
import GlobalDirectSalesProfitYoYGrowth from '@/components/PermissionsModule/Human/GlobalDirectSalesProfitYoYGrowth.vue'
//全球各区经营类指标
import GlobalBusinessMetricsByRegion from '@/components/PermissionsModule/Human/GlobalBusinessMetricsByRegion.vue'
//全球各区运营类指标
import OperationalEfficiencyMetrics from '@/components/PermissionsModule/Human/OperationalEfficiencyMetrics.vue'
//全球各区分类指标得分
import OperationalEfficiencyScore from '@/components/PermissionsModule/Human/OperationalEfficiencyScore.vue'
const store = roleStore() as any
const isDepartment = computed(() => baseToolsStore().isDepartment) //是否是部门
const { humanLevel } = store
// 1 全球 2 区域 3 国家
const newRole = ref(0)
newRole.value = humanLevel // 初始化面板权限
// 深度监听 store.panelPermissions
watch(
  () => store.humanLevel,
  (newVal) => {
    newRole.value = newVal
  }
)
//获取当前月份
const month = computed(() => {
  return headersStore().month
})
// 是否为集团总部
const isHeadquarters = computed(() => {
  return headersStore().scope_code === '0000100001'
})
const props = defineProps({
  showRemainingComponents: {
    type: Boolean,
    default: false,
  },
})
</script>

<template>
  <Performance
    v-if="(newRole !== 0 || isDepartment) && month === '00' && !isHeadquarters"
  />

  <OperationalEfficiencyScore
    v-if="newRole <= 2 && !isHeadquarters && !isDepartment && month != '00'"
  />
  <ITPerformanceReport v-if="isDepartment && month !== '00' && newRole === 2" />

  <div v-if="showRemainingComponents">
    <GlobalDirectSalesRevenueYoYGrowth />
    <GlobalDirectSalesProfitYoYGrowth />
    <EurasiaCollectionRate v-if="newRole == 2 && month != '00'" />
    <RepaymentRateTrend v-if="newRole == 2 && month == '00'" />
    <GlobalBusinessMetricsByRegion v-if="newRole == 1 && month == '00'" />
    <OperationalEfficiencyMetrics v-if="newRole == 1 && month == '00'" />
    <OperationalEfficiencyScore
      v-if="newRole == 2 && !isHeadquarters && !isDepartment && month == '00'"
    />
    <GlobalPerformanceDistributionFile v-if="newRole === 1 && month !== '00'" />
  </div>
</template>
<style lang="scss" scoped></style>
